/**
 * Created by Administrator on 2017/5/8.
 */
import React, { Component,PropTypes  } from 'react';
import {Link} from 'react-router';
import '../../Stylesheets/wx/personalCenter.css'
import Top from '../CommonComponent/Top'

const introduce = [
    {
        title:'资金管理',
        content:[
            {dt:'1.我的余额',dd:'个人发展下级代理及转介绍所获得的利润（可提现）'},
            {dt:'2.我的货款',dd:'代理充值的进货款，不可提现'},
            {dt:'3.我的积分',dd:'目前分享达人和顾客可享受（积分比例1:10）'},
            {dt:'4.银行卡',dd:'提交绑定银行卡'}
        ]
    },
    {
        title:'进货管理（虚拟库存）',
        content:[
            {dt:'1.进货订单',dd:'从上级代理处进货，包含待发货(除联创外其它代理可查看已进货订单)以及已完成（联创首批进货可查看）'},
            {dt:'2.发货订单',dd:'上级代理给下级安排发货'},
            {dt:'3.进货',dd:'当虚拟库存不足时，代理需进货'}
        ]
    },
    {
        title:'库存管理',
        content:[
            {dt:'1.盘点库存',dd:'查看目前自己的库存量'},
            {dt:'2.我的库存',dd:'包含可配库存（此为实际库存）以及代管库存（此为虚拟库存）;取货（当需要实际货物时点击）注:需先完善收获信息（各级代理享受不同的包邮政策）'}
        ]
    },
    {
        title:'配货管理（实际库存）',
        content:[
            {dt:'1.申请配货订单',dd:'向上级代理申请发货'},
            {dt:'2.配货出库',dd:'下级代理订单配货出货'}
        ]
    },
    {
        title:'代理管理',
        content:[
            {dt:'1.下级代理',dd:'代理个人发展的下级代理'},
            {dt:'2.我的推荐',dd:'所有通过代理分享的二维码扫描进来的客户'},
            {dt:'3.代理结构图',dd:'代理个人团队所有代理以及关系'},
            {dt:'4.授权证书',dd:'代理授权证书电子档'},
            {dt:'5.代理升级',dd:'当代理想升级为更高级别的代理，可申请并充值相对应级别的金额即可'}
        ]
    },
    {
        title:'订单管理',
        content:[
            {dt:'1.我的订单',dd:'显示我的订单相关状态'}
        ]
    },
]

export default class TitleClassify extends Component {
    static contextTypes = {
        router:PropTypes.object
    }
    // 构造
    constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            show:'none',
            index:this.props.location.query.index,
            titleCon:'',
            content:''
        };
    }
    async componentWillMount() {
        const index = this.props.location.query.index;
        await this.setState({index:index});
        this.setState({titleCon:introduce[index].title,content:introduce[index].content})
    }

    render(){
        const {titleCon,content} = this.state
        return(
            <div>
                <Top
                    title ={titleCon}
                />
                <div className="containerNav flex flex-v f14" style={{top:50}}>
                    <div className="pAll">
                        <p style={{fontWeight:600,fontSize:16,marginBottom:15}}>{titleCon}</p>
                        {
                            content.length>0?
                                content.map(el=>{
                                    return(
                                        <dl>
                                            <dt style={{fontWeight:'normal'}}>{el.dt}</dt>
                                            <dd style={{paddingLeft:28}}>{el.dd}</dd>
                                        </dl>
                                    )
                                })
                                :null
                        }
                    </div>
                </div>
            </div>
        )
    }
}
